;(function () {

    window.router = new VueRouter({

        // 全局配置router-link ，  标签生成自带css样式，当选中的时候，默认会显示盖样式
        linkActiveClass: 'active',

        routes: [
            {
                path: '/',
                component: AppHome
            },
            {
                path: '/news',
                component: News,
                children: [
                    {
                        path: '/news/sport',
                        component: Sport,
                        children: [
                            {
                                // 配置 详细的请求路径，:id  表示路径变量占位符
                                path: '/news/sport/detail/:id',
                                component: SportDetail
                            }
                        ]
                    },
                    {
                        // 简写方式 等价于  /news/tech  ， 不要写 /tech ，这样写就表示，是根路径下面的路径
                        path: 'tech',
                        component: Tech,
                        children: [
                            {
                                path: "/news/tech/detail/:id",
                                component: TechDetail
                            }
                        ]
                    },
                    {
                        //  在点击新闻管理之后，默认选中新闻，就是在访问/news 路径的时候，会显示News 组件，同时也会显示Sport 组件的数据
                        path: '',
                        redirect: '/news/sport'
                    }
                ]
            },
            {
                path: '/about',
                component: About
            }
        ]
    });

})();
